<template>
  <ButtonGroup :title="configKey === 'titleColor' ? '标题颜色' : '描述颜色'" :status="color">
    <!-- <el-button
      :style="{
        backgroundColor: status,
      }"
      @click="changeColor"
    >
      <font-awesome-icon icon="arrow-down" />
      <el-color-picker v-model="color" />
    </el-button> -->

    <el-color-picker v-model="color" @change="changeColor(color)" />
  </ButtonGroup>
</template>

<script setup lang="ts">
import ButtonGroup from './ButtonGroup.vue'
import { ref, inject } from 'vue'
const props = defineProps<{
  configKey: string
  status: string
  isShow: boolean
  editCom: VueComType
}>()
const color = ref(props.status)
const updateStatus = inject('updateStatus')
const changeColor = (newVal: sting) => {
  updateStatus(props.configKey, newVal)
}
</script>

<style scoped></style>
